﻿<%@ Page Language="C#" AutoEventWireup="true" EnableEventValidation="false" CodeBehind="AddMyVocation.aspx.cs"
    Inherits="MyVocationSpace.AddMyVocation" ValidateRequest="false" ViewStateEncryptionMode="Never" %>

<%@ Register Src="Header.ascx" TagName="header" TagPrefix="uc" %>
<%@ Register Src="Footer.ascx" TagName="footer" TagPrefix="uc1" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title>..:: MY VocationSpace ::..</title>
    <link href="css/Default.css" rel="stylesheet" type="text/css" />
    <link href="css/NewStyle.css" rel="stylesheet" type="text/css" />
    <script src="js/jquery-1.7.1.min.js" type="text/javascript"></script>
    <script src="js/jquery-1.4.2.min.js" type="text/javascript"></script>
    <link href="css/jquery-ui.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript">

        function desDetails() {
            var listvalue = document.getElementById("lstVocation1").value;
            //alert(listvalue);
            var xmlhttp;
            if (window.XMLHttpRequest) {
                xmlhttp = new XMLHttpRequest();
            }
            else {
                xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
            }
            xmlhttp.onreadystatechange = function () {
                if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                    //                    alert("hi");
                    //                    alert(xmlhttp.responseText);                  
                    document.getElementById("VocationDescriptionDiv").innerHTML = xmlhttp.responseText;
                }
            }
            xmlhttp.open("POST", "AJAX/GetVocationDescription.aspx?listvalue=" + listvalue, true);
            xmlhttp.send();
        }


        function VocationBtnEnable() {
            var ddlIndustry = document.getElementById("ddlIndustry");
            var a = ddlIndustry.options[ddlIndustry.selectedIndex].value;
            if (a == 0) {
                // alert(a);
                document.getElementById("btnAddItem").disabled = true;
                document.getElementById("btnRemoveItem").disabled = true;
            }
            else {
                document.getElementById("btnAddItem").disabled = false;
                document.getElementById("btnRemoveItem").disabled = false;
            }
        }

        function chkIndustryVocation() {
            var ddlIndustry = document.getElementById("ddlIndustry");
            var a = ddlIndustry.options[ddlIndustry.selectedIndex].value;
            //var listvalue = document.getElementById("lstVocation2");
            var idspanIndusVoc = document.getElementById("idspanIndusVoc");
            if (a == 0) {
                idspanIndusVoc.style.display = "block";
                idspanIndusVoc.innerHTML = "Please, select industry before select your vocation";
                return false;
            }

            //            if (listvalue.options.length==0) {
            //                idspanIndusVoc.style.display = "block";
            //                idspanIndusVoc.innerHTML = "Please, select vocation";
            //                return false;
            //            }
        }


       
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <center>
        <div>
            <uc:header ID="header" runat="server" />
        </div>
        <div id="content-wrapper">
            <center>
                <div style="height: auto" class="Content">
                    <table>
                        <tr>
                            <td style="width: 800px">
                                <table>
                                    <tr>
                                        <td align="left" style="font-size: 16px; width: 800px; font-weight: bold;">
                                            Add / Edit Vocations
                                            <hr style="width: 800px; border: 1px dashed #D6D6D6;" />
                                        </td>
                                    </tr>
                                </table>
                            </td>
                        </tr>
                        <tr>
                            <td>
                            </td>
                        </tr>
                        <tr>
                            <td style="width: 700px;" align="center">
                                <table>
                                    <tr>
                                        <td colspan="3" align="left" style="font-weight: bold; height: 70px; border: 1px solid #1C6F93;
                                            font-family: Arial; font-size: 15px;">
                                            <span style="vertical-align: top">Select Industry:</span><%--onchange="VocationBtnEnable(this.form.ddlIndustry);"--%>
                                            <asp:DropDownList ID="ddlIndustry" runat="server" Width="250px">
                                            </asp:DropDownList>
                                            <span>
                                                <asp:Button ID="btnSubmitIndustry" CssClass="formBtnEdit"
                                                    Width="100px" runat="server" Text="Add Industry" OnClick="btnSubmitIndustry_Click" />
                                            </span>
                                            <asp:RequiredFieldValidator ID="rfvddlIndustry" ForeColor="Red"
                                                CssClass="validate" ControlToValidate="ddlIndustry" runat="server" InitialValue="0"
                                                ErrorMessage="Please select Industry."></asp:RequiredFieldValidator>
                                            <br />
                                            <span style="font-family: Arial; padding-left: 65px; color: Gray; font-weight: normal;
                                                font-size: 12px; padding-right: 10px; background-color: White">If your desired Industry
                                                not exist?</span><span style="font-size: 12px; font-weight: normal;"><a href="AddEditIndustry.aspx">Create
                                                    New Industry</a></span>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td colspan="3" style="padding-top: 10px;">
                                            <hr />
                                        </td>
                                    </tr>
                                    <tr>
                                        <td style="color: Black; font-size: 16px; font-weight: bold; font-family: Arial;
                                            vertical-align: bottom">
                                            Select Vocation:
                                        </td>
                                        <td colspan="2" style="color: Black; font-size: 14px; font-weight: bold; font-family: Arial;
                                            padding-left: 80px">
                                            Selected Vocation:<br />
                                            <span id="ErrorMsg" style="color: Red;" runat="server">[Maximum 5 Vocations allow]</span>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>
                                            <asp:ListBox ID="lstVocation1" Width="300px" runat="server" Rows="15" onchange="desDetails();">
                                            </asp:ListBox>
                                        </td>
                                        <td>
                                            <table>
                                                <tr>
                                                    <%--OnClientClick="return chkIndustryVocation();" --%>
                                                    <td>
                                                        <asp:Button ID="btnAddItem" CssClass="formBtnEdit" Width="70px" runat="server" Text="Add"
                                                            OnClick="btnAddItem_Click" />
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td>
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td>
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td>
                                                        <asp:Button ID="btnRemoveItem" CssClass="formBtnEdit" Width="70px" runat="server"
                                                            Text="Remove" OnClick="btnRemoveItem_Click" />
                                                    </td>
                                                </tr>
                                            </table>
                                        </td>
                                        <td valign="top">
                                            <asp:ListBox ID="lstVocation2" Width="300px" runat="server" Rows="15"></asp:ListBox>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td colspan="3" align="right">
                                            <span id="idspanIndusVoc" style="display: none; font-weight: bold; font-family: Arial;
                                                font-size: 13px; color: Red;"></span>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td colspan="2" align="left">
                                            <span style="font-family: Arial; color: Gray; font-size: 12px; padding-right: 10px;
                                                background-color: White">If your desired vocation not exist?</span><span style="font-size: 12px;"><a
                                                    href="AddNewVocation.aspx">Create New Vocation</a></span>
                                        </td>
                                        <td align="right">
                                            <span style="vertical-align: top;"><span id="idSpanVocation" runat="server" style="display: none;
                                                text-align: left; color: Red; font-family: Arial; font-weight: bold; font-size: 13px;">
                                            </span><span style="font-size: 13px; text-align: left; vertical-align: top; font-family: Arial;">
                                                <asp:LinkButton ID="lnkGoBack" PostBackUrl="~/EditProfile.aspx" CausesValidation="false"
                                                    runat="server">Go to Edit My Profile</asp:LinkButton></span></span>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td colspan="3" style="border: 1px solid #1C6F93;">
                                            <table align="left">
                                                <tr>
                                                    <td valign="top" style="font-weight: bold; font-family: Arial; font-size: 15px; width: 50px">
                                                        Description:
                                                    </td>
                                                    <td style="font-family: Arial; text-align:justify; padding-right:7px; font-size: 13px;">
                                                        <div id="VocationDescriptionDiv" style="width: 600px; height:auto"  runat="server">
                                                        </div>
                                                    </td>
                                                </tr>
                                            </table>
                                        </td>
                                    </tr>
                                </table>
                            </td>
                        </tr>
                    </table>
                </div>
            </center>
        </div>
        <div style="clear: both">
        </div>
        <div>
            <uc1:footer runat="server" ID="footer"></uc1:footer>
        </div>
    </center>
    </form>
</body>
</html>
